<!DOCTYPE HTML>
<html>
	<head>
		<meta charset="utf-8">
		<title>OrderRest - Management System</title>
		<link rel="stylesheet" type="text/css" href="css/reset.css">
		<link rel="stylesheet" type="text/css" href="css/grid.css">
		<style type="text/css">
			body {
				background-color: #CACACA;
			}
			.header {
				background:#2F2F2F;
				width: 100%;
				height:	40px;
			}
			.banner {
				margin: 10px;
			}
			.banner p {
				font-size: 20px;
				color: #FFF;
			}
			.header:after {
				content: "";
				display: block;
				clear: both;
			}
			.main {
				width: auto;
				height: 80%;
			}
			.siderbar {
				height: 70%;
				margin: 20px;
				background: #939393;
				border: 1px solid black;
				border-radius: 10px 10px 0 0/ 10px 10px 0 0;
				text-align: center;
			}
			.siderbar h1 {
				color: #FFF;
				font-size: 40px;
				font-weight: bolder;
				font-family: cursive;
				line-height: 60px;
			}
			.column ul {
				padding: 10px;
				background: #FFF;
			}
			.column li {
				width: 100%;
				margin-top: 10px;
			}
			.siderbar 
			.content {
				height: 100%;
				background: #EEEEEE;
			}
			

			
.css_btn_class {
	font-size:16px;
	font-family:Arial;
	font-weight:normal;
	-moz-border-radius:8px;
	-webkit-border-radius:8px;
	border-radius:8px;
	border:1px solid #ffaa22;
	padding:9px 18px;
	text-decoration:none;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #ffec64), color-stop(100%, #ffab23) );
	background:-moz-linear-gradient( center top, #ffec64 5%, #ffab23 100% );
	background:-ms-linear-gradient( top, #ffec64 5%, #ffab23 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffec64', endColorstr='#ffab23');
	background-color:#ffec64;
	color:#969696;
	display:inline-block;
	text-shadow:1px 1px 0px #ffee66;
 	-webkit-box-shadow:inset 1px 1px 0px 0px #fff6af;
 	-moz-box-shadow:inset 1px 1px 0px 0px #fff6af;
 	box-shadow:inset 1px 1px 0px 0px #fff6af;
}.css_btn_class:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #ffab23), color-stop(100%, #ffec64) );
	background:-moz-linear-gradient( center top, #ffab23 5%, #ffec64 100% );
	background:-ms-linear-gradient( top, #ffab23 5%, #ffec64 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffab23', endColorstr='#ffec64');
	background-color:#ffab23;
}.css_btn_class:active {
	position:relative;
	top:1px;
}

		</style>
	</head>
	<body>
		<div class="header">
			<span class="banner" style="float: left;">
				<p>Restaurant:</p>
			</span>
			<span class="banner" style="float: right;">
				<p>Welcom, !</p>
			</span>
		</div>
		<div class="main grid">
			<div class="siderbar col-1-4">
				<h1>Feature</h1>
				<div class="column">
					<ul>
						<li>
							<a href="#" class="css_btn_class">餐廳資訊修改</a>
						</li>
						<li>		
							<a href="#" class="css_btn_class">餐廳定位資訊</a>
						</li>
						<li>
							<a href="#" class="css_btn_class">統計資訊</a>
						</li>
					</ul>
					
				</div>	
			</div>
			<div class="content col-3-4">
			</div>
		</div>
		<div class="footer">
		</div>
	</body>
</html>
